import React, { lazy, Suspense } from "react";
import { Navigate, Outlet, useRoutes } from "react-router-dom";
import Loading from "@/components/Loading";
import AuthComponent from "@/components/AuthComponent";
import Index from "../pages/Index";
import { DatabaseOutlined, HomeOutlined, MedicineBoxOutlined } from "@ant-design/icons";

// 封装一个用于提供懒 加载的方法
const lazyLoading = function (path: string) {
    const Com = lazy(() => import("@/pages/" + path));
    return (
        <Suspense fallback={<Loading />}>
            <Com></Com>
        </Suspense>
    )
}
export const routes = [
    {
        path: "/",
        element: (
            <AuthComponent>
                {/*{ lazyLoading("Index")}*/}
                <Index />
            </AuthComponent>
        ),
        children: [
            {
                //  主页
                label: "主页",
                path: "/",
                icon: <HomeOutlined />,
                element: lazyLoading("Home")
            }, {
                // 数据管理
                label: "数据管理",
                path: "/cmn",
                icon: <DatabaseOutlined />,
                element: <Outlet />,
                children: [
                    {
                        index: true,
                        isHide: true,//是否隐藏
                        element: <Navigate to={"dict"} />
                    },
                    {
                        // 数据字典
                        label: "数据字典",
                        path: "/cmn/dict",
                        element: lazyLoading("cmn/dict")
                    }
                ]
            }, {
                label: "医院管理",
                path: "/hospital",
                icon: <MedicineBoxOutlined />,
                element: <Outlet />,
                children: [
                    {
                        index: true,
                        isHide: true,//是否隐藏
                        element: <Navigate to={"hospitalSet"} />
                    },
                    {
                        // 医院设置
                        label: "医院设置",
                        path: "/hospital/hospitalSet",
                        element: lazyLoading("hospital/hospitalSet")
                    },
                    {
                        // 医院列表
                        label: "医院列表",
                        path: "/hospital/hospitalList",
                        element: lazyLoading("hospital/hospitalList")
                    }
                ]
            }
        ]
    }

    , {
        path: "/login",
        element: lazyLoading("Login")
    }, {
        path: "*",
        element: lazyLoading("NotFound")
    }
]
// 返回用于描述侧边栏的数据
export const renderMenuItem = () => {
    return (routes.find(v => v.path === "/") as any).children;
}


// 描述路由
export default function () {
    // /cmn/cmn
    const renderRouter = useRoutes(routes)
    return renderRouter;
}
